:root {
	--c-bg-scrollbar: var(--c-bg);
	--c-bg-scrollbar-thumb: var(--theme-460);
	--c-bg-scrollbar-thumb-hover: var(--theme-430);
	overflow-y: auto;
}

@mixin customScrollbar($thin: true) {
	@if $thin {
		scrollbar-width: thin;
	}
	scrollbar-color: var(--c-bg-scrollbar-thumb) var(--c-bg-scrollbar);

	&::-webkit-scrollbar {
		@if $thin {
			width: 8px;
			height: 8px;
		} @else {
			width: 17px;
			height: 17px;
		}
	}

	&::-webkit-scrollbar-thumb {
		background-color: var(--c-bg-scrollbar-thumb);

		&:hover {
			background-color: var(--c-bg-scrollbar-thumb-hover);
		}
	}

	&::-webkit-scrollbar-track {
		background-color: var(--c-bg-scrollbar);
	}
}
